<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>漳泽农商银行</title>
		<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<link rel="stylesheet" href="css/ydui.css" />
		<link rel="stylesheet" href="css/wx_hb.css?456" />
		<style>
			.g-scrollview:after {
				height: 0
			}
			.confirm-ft > a.confirm-btn.primary{
				color:#B7302C
			}
			.footer {
				width: 100%;
				text-align: center;
				margin: 25px auto;
			}
			.footer button {
				width: calc((100% - 100px) / 2);
				height: 35px;
				text-align: center;
				line-height: 35px;
				font-size: 16px;
				color: #B7302C;
				padding: 0;
				display: inline-block;
				background: #FDE8B8;
				border: 0;
				border-radius: 25px;
				margin-left: 15px;
				font-weight:bold
			}
			@keyframes fn{
				0% {transform:rotateX(-15deg) rotateY(0deg);}
			    100%{transform:rotateX(0deg) rotateY(360deg);}

			}
			@-moz-keyframes fn{
				0% {transform:rotateX(-15deg) rotateY(0deg);}
			    100%{transform:rotateX(0deg) rotateY(360deg);}
			}
			@-ms-keyframes fn{
				0% {transform:rotateX(-15deg) rotateY(0deg);}
			    100%{transform:rotateX(0deg) rotateY(360deg);}
			}
			@-webkit-keyframes fn{
				0% {transform:rotateX(-15deg) rotateY(0deg);}
			    100%{transform:rotateX(0deg) rotateY(360deg);}
			}
			.box{				
		    	width:150px;
            	height:300px;
            	position:relative;
            	margin:auto;
            	margin-top:150px;
            	transform-style:preserve-3d;
            	transform:rotateX(0deg);
            	
            	animation-iteration-count: infinite;
		    	animation-timing-function: linear;
		    	position: relative
			}
			.boxdh{
				animation: fn2 3s;
				animation-fill-mode:forwards;
			}
			.ios .g-scrollview{margin:0}
			.box>div{
				width:150px;
				height:300px;
				position: absolute;
				left:0;
				top:0;
			}
			.box img{width:100%}
			.hdcont p{font-weight:bold}
		</style>
	</head>

	<body>
		<section class="g-flexview">
			<section class="g-scrollview">
				<img src="img/hbtop2.jpg" style="width:100%;margin-top:-2px">
				<div class="bg">
					<h3 class="cjjh">您还有<b>0</b>次拆红包机会</h3>
					<img src="img/hbwd.png" class="wd">
					<div class="main">
						<li><img src="img/hb1.jpg"></li>
						<li><img src="img/hb2.jpg"></li>
						<li><img src="img/hb3.jpg"></li>
						<li><img src="img/hb4.jpg"></li>
						<li><img src="img/hb5.jpg"></li>
						<li><img src="img/hb6.jpg"></li>
					</div>
					<div class="hdsj">
						<img src="img/hdtime.png">
						<p>2022年1月31日-2022年2月15日</p>
					</div>
					<div class="hdcont">
						<img src="img/hdcont.png">
						<div>
							<p>1、2022年1月31日-2月6日关注漳泽农商银行微信公众号即可参加“过年七天乐，福虎闹新春”活动。</p>
							<p>2、2022年1月31日-2月15日期间办理定期存款3万元（含）以上，申请贷款、信用卡和晋享E付的客户，凭活动二维码即可兑换礼品。</p>
							<p>3、每个微信号参与3次，转发链接可再参与1次。</p>
							<p>4、每笔业务仅兑奖一次。 </p>
							<p>5、兑奖有效期2022年1月31日-2月15日。</p>
						</div>
					</div>
					<div style="margin-top:15px;text-align: center;" class="footer">
						<button class="btn1">中奖记录</button>
						<button class="btn2">分享好友</button>
					</div>
					<h5 style='width:100%;margin:15px auto;text-align: center;color:#fff;'>技术支持：长治市互邦软件工程有限公司</h5>
				</div>
				<!--中奖提示-->
				<div id="mask">
					<div class="blin"></div>
					<div class="caidai"></div>
					<div class="winning">
						<!--<div class="red-head"></div>
						<div class="red-body"></div>
						<div id="card">
							<a href="" target="_self" class="win"></a>
						</div>
						<a href="" target="_self" class="btn"></a>-->
						<img src="" style="width:100%" id="zjtp">
						<span id="close"></span>
					</div>
				</div>
				<div id="mask-card" >
					<div class="box">
						<div style="transform: rotateY(0deg) translateZ(275px);">
							<img src="img/hb1.jpg">
						</div>
						<div style="transform: rotateY(60deg) translateZ(275px);">
							<img src="img/hb2.jpg">
						</div>
						<div style="transform: rotateY(120deg) translateZ(275px);">
							<img src="img/hb3.jpg">
						</div>
						<div style="transform: rotateY(180deg) translateZ(275px);">
							<img src="img/hb4.jpg" >
						</div>
						<div style="transform: rotateY(240deg) translateZ(275px);">
							<img src="img/hb5.jpg">
						</div>
						<div style="transform: rotateY(300deg) translateZ(275px);">
							<img src="img/hb6.jpg">
						</div>
					</div>
				</div>
				
			</section>
		</section>
		<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
		<script type="text/javascript" src="js/ydui.flexible.js"></script>
		<script src="js/swiper.jquery.min.js"></script>
		<script type="text/javascript" src="js/ydui.js"></script>
		<script type="text/javascript" src="js/wx_hb.js?20222356"></script>
		<script>
			function onBridgeReady() {
				WeixinJSBridge.call('hideOptionMenu');
				 WeixinJSBridge.call('hideToolbar');
			}
			if(typeof WeixinJSBridge == "undefined") {
				if(document.addEventListener) {
					document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
				} else if(document.attachEvent) {
					document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
					document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
				}
			} else {
				onBridgeReady();
			}
		</script>
	</body>

</html>